{% extends 'myadmin/base.html' %}

{% block title %}
<title>会员管理</title>
{% endblock %}

{% block content %}
  <!-- content start -->
  <div class="admin-content">
    <div class="admin-content-body">
      <div class="am-cf am-padding am-padding-bottom-0">
        <div class="am-fl am-cf"><strong class="am-text-primary am-text-lg">会员管理</strong> / <small>User Manage</small></div>
      </div>

      <hr>

      <div class="am-g">
        <div class="am-u-sm-12 am-u-md-6">
          <div class="am-btn-toolbar">
            <div class="am-btn-group am-btn-group-xs">
              <button type="button" class="am-btn am-btn-default"><a href="{% url 'myadmin_user_add' %}"> 添加</a></button>
            </div>
              <button
                type="button"
                class="am-btn am-btn-success"
                id="doc-prompt-toggle">
                Prompt
              </button>
              <div class="am-modal am-modal-prompt" tabindex="-1" id="my-prompt">
                <div class="am-modal-dialog">
                  <div class="am-modal-hd">Amaze UI</div>
                  <div class="am-modal-bd">
                    请上传一个文件
                    <input type="file" class="am-modal-prompt-input">
                  </div>
                  <div class="am-modal-footer">
                    <span class="am-modal-btn" data-am-modal-cancel>取消</span>
                    <span class="am-modal-btn" data-am-modal-confirm>提交</span>
                  </div>
                </div>
              </div>
          </div>
        </div>
        <form action="" method="GET">
          <!-- 页面搜索功能 -->
          <div class="am-u-sm-12 am-u-md-3">
            <div class="am-form-group">
              <!-- 搜索类别，叫selecttype -->
              <select name="selecttype" data-am-selected="{btnSize: 'sm'}">
                <option value="all" {% if request.GET.selecttype == "all" %} selected {% endif %}>所有类别</option>
                <option value="phonenum" {% if request.GET.selecttype == "phonenum" %} selected {% endif %}>手机号</option>
                <option value="nikename" {% if request.GET.selecttype == "nikename" %} selected {% endif %}>昵称</option>
                <option value="sex" {% if request.GET.selecttype == "sex" %} selected {% endif %}>性别</option>
              </select>
            </div>
          </div>
          <div class="am-u-sm-12 am-u-md-3">
            <div class="am-input-group am-input-group-sm">
              <!-- 搜索类别，叫selectkey-->
              <input type="text" name="selectkey" value="{{ request.GET.selectkey }}" class="am-form-field">
                <span class="am-input-group-btn">
                  <button class="am-btn am-btn-success" type="button">搜索</button>
                </span>
            </div>
          </div>
        </form>
      </div>

      <div class="am-g">
        <div class="am-u-sm-12">
          <form class="am-form">
            <table class="am-table am-table-striped am-table-hover table-main">
              <thead>
              <tr>
                  <th class="table-check"><input type="checkbox" /></th>
                  <th>ID</th>
                  <th>头像</th>
                  <th>手机号</th>
                  <th>昵称</th>
                  <th>性别</th>
                  <th>居住地址</th>
                  <th>操作</th>
              </tr>
              </thead>
              <tbody>
                {% for i in user_data %}
                <tr>
                  <td><input type="checkbox" /></td>
                  <td>{{ i.id }}</td>
                  <td><img src="{{ i.img_url }}" style="width:100px";></td>
                  <td>{{ i.phonenum }}</td>
                  <td>{{ i.nikename }}</td>
                  <td>{{ i.sex }}</td>
                  <td>{{ i.homeaddress }}</td>
                  <td>
                    <div class="am-btn-toolbar">
                      <div class="am-btn-group am-btn-group-xs">
                        <button class="am-btn am-btn-default am-btn-xs am-text-secondary"><span class="am-icon-pencil-square-o"></span><a href="{% url 'myadmin_user_edit' %}?id={{ i.id }}"> 编辑</a></button>
                        <button class="am-btn am-btn-default am-btn-xs am-text-danger am-hide-sm-only"><span class="am-icon-trash-o"></span><a href="{% url 'myadmin_user_del' i.id %}"> 删除</a></button>
                      </div>
                    </div>
                  </td>
                </tr>
              {% endfor %}
              </tbody>
            </table>
            <div class="am-cf">
              <td>总页数：{{ user_data.paginator.num_pages }}</td>
              <td>总条数：{{ user_data.paginator.count }}</td>
              <div class="am-fr">
                <ul class="am-pagination">
                  <!-- 分页管理 -->
                  {% load pagetag %}
                  <!-- 使用自定义分页标签 -->
                  <!-- 从后端获取user_data数据和request对象，然后调用pageinit自定义标签 -->
                  {% pageinit user_data.paginator.num_pages request %}

<!--                  {% for i in user_data.paginator.page_range %}-->
<!--                    <li><a href="?page={{ i }}">{{ i }}</a></li>-->
<!--                  {% endfor %}-->
                </ul>
              </div>
            </div>
            <hr />
            <p>注：.....</p>
          </form>
        </div>

      </div>
    </div>

    <footer class="admin-content-footer">
      <hr>
      <p class="am-padding-left">© 2014 AllMobilize, Inc. Licensed under MIT license.</p>
    </footer>

  </div>
  <!-- content end -->

<a href="#" class="am-icon-btn am-icon-th-list am-show-sm-only admin-menu" data-am-offcanvas="{target: '#admin-offcanvas'}"></a>

<footer>
  <hr>
  <p class="am-padding-left">© 2014 AllMobilize, Inc. Licensed under MIT license.</p>
</footer>
{% endblock %}
{% block script %}
$(function() {
  $('#doc-prompt-toggle').on('click', function() {
    $('#my-prompt').modal({
      relatedTarget: this,
      onConfirm: function(e) {
        $.get('{% url 'myadmin_type_del' %}',{'id':id},function(data){
          // 判断是否成功,根据返回的code来判断
          if(data['code'] == 0){
            // console.log($(this))
            // 删除这一行数据
            a.parents('tr').remove()
          }
          //alert(data['msg'])
          showmsg(data['msg'])
        },'json')

      },
      onCancel: function(e) {
        alert('不想说!');
      }
    });
  });
});

{% endblock %}


